<template>
	<view class="container">
		<image class="bg-img" src="../../../static/tab/back.png"></image>
		<view class="content"></view>
	</view>
	<view class="container">
		<view>
			<div class="name">姓名：<input type="text" class="textname" placeholder=" 请输入您的姓名"
					v-model="this.result[0].name" /> </div>
			<div class="sex">性别：<input type="text" class="textname" placeholder=" 请输入您的性别"
					v-model="this.result[0].sex" /></div>
			<div class="class">班级：<input type="text" class="textname" placeholder=" 请输入您的班级"
					v-model="this.result[0].class" /></div>
			<div class="teather">班主任：<input type="text" class="textname" placeholder=" 请输入您的班主任"
					v-model="this.result[0].teather" /></div>
			<button class="Edit">保存修改</button>
		</view>
	</view>
</template>


<script>
	export default {
		data() {
			return {
				result: [],
			};
		},
		mounted() {
			this.getDate();
		},
		methods: {
			getDate() {
				uni.request({
					url: 'https://mock.apifox.cn/m1/1392280-0-default/Percenter/Detail?apifoxToken=59M2PUiNtRqEoawlk5S819tgQNaAdXxz',
					method: 'GET',
					data: {},
					success: res => {
						console.log(res);
						this.result = res.data.data;
						console.log(this.result)
					},
					fail: () => {},
					complete: () => {}
				});
			}
		}

	}
</script>

<style>
	.textname {
		width: 150px;
		background-color: #fffef7;
		float: right;
		margin-right: 90px;
		border-radius: 4px;
		opacity: 0.7;
	}

	.bg-img {
		position: fixed;
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
		z-index: -1;
	}


	.name {
		padding-top: 180px;
		padding-left: 70px;
	}

	.sex {
		padding-top: 10px;
		padding-left: 70px;
	}

	.class {
		padding-top: 10px;
		padding-left: 70px;
	}

	.teather {
		padding-top: 10px;
		padding-left: 70px;
	}

	.Edit {
		width: 150px;
		height: 38px;
		font-size: 17px;
		margin-top: 20px;
		opacity: 0.7;
	}

	.query1 {
		padding-bottom: 10px;
	}
</style>
